$(function() {
    //把js里的数组转化成字符串，并储存到本地
    localStorage.setItem("Work_datashow", JSON.stringify(Work_data));
    let Work_datashow = JSON.parse(localStorage.getItem("Work_datashow"));

    //动态生成分页栏
    //页码 翻页功能
    let pageNo = 1; //当前页

    let html = "";
    let pages;
    //初始化表格
    init(pageNo, Work_datashow);

    function init(pageNo, Work_datashow) {
        let tableHeight = document.getElementById("content");
        tableHeight.style.height = Work_datashow.length * 30 + 40 + "px"; //30:数据的高度 40：thead高度

        let pageStrip = 5; //页面展示几条数据
        let pageNum = Math.ceil(Work_datashow.length / 5); //页数
        //动态生成表格高度
        $(".pages").html("");
        //生成对应的页码

        for (let i = 1; i <= pageNum; i++) {
            pages = `<a class="page-link code" href="#">${i}</a>`
            $(".pages").append(pages);
        };
        //动态生成表格
        //创建一个新的数组用来渲染每个页面的数据
        let newWork_datashow = Work_datashow.slice((pageNo - 1) * pageStrip, (pageNo - 1) * pageStrip + pageStrip);
        $("#tbody").html("");
        $("#page-text").html("");
        for (let i = 0; i < newWork_datashow.length; i++) {
            html = `<tr>
        <td>${newWork_datashow[i].Work_id}</td>
        <td>${newWork_datashow[i].Work_name}</td>
        <td>${newWork_datashow[i].Work_place}</td>
        <td>${newWork_datashow[i].Work_content}</td>      
        <td>${newWork_datashow[i].Work_tel}</td>
        <td>在职</td>
        <td> <button type="button"  class="btn btn-info btn-primary xiugai" data-toggle="modal" data-target="#myModalll">修改</button>
        <button type="button" class="btn btn-danger del">删除</button></td>
         </tr>`
            $("#tbody").append(html);
        }
        $("#page-text").append(`
    当前第<span style="color: #a2a2a2">${pageNo}</span>页,共<span style="color: #a2a2a2">${pageNum}</span>页
    `);

        //点击页码出现对应的数据
        $(document).on("click", ".code", function() {
                pageNo = $(this).html();
                init(pageNo, Work_datashow);
            }) //上一页和下一页
        $(document).on("click", "#pre", function() {
            if (pageNo != 1 && pageNo >= 2) {
                pageNo--;
                init(pageNo, Work_datashow)

            }
        })
        $(document).on("click", "#next", function() {
            if (pageNo < pageNum) {
                pageNo++;
                init(pageNo, Work_datashow)
            }
        })
    }
    //搜索功能
    //限制初始化函数调用
    $(document).on("click", "#shousuo", function() {
            let shousuo = $(".shoushuokuang").val()

            // let sz = /^[0-9]+$/
            // let dh = /^(13[0 - 9]|14[5|7]|15[0|1|2|3|5|6|7|8|9]|18[0|1|2|3|5|6|7|8|9])\d{8}$/ //电话
            // let sfz = /^\d{15}|\d{18}$/ //身份证
            // let qqh = /[1-9][0-9]{4,}/ //QQ号
            // let mz = /^[\u4e00-\u9fa5]{0,}$/ //名字
            for (let i = 0; i < Work_datashow.length; i++) {
                // if (sz.test(shousuo) === true || dh.test(shousuo) === true || sfz.test(shousuo) === true || qqh.test(shousuo) === true || mz.test(shousuo) === true || sz.test(shousuo === true)) {}
                if (shousuo == Work_datashow[i].Work_id && shousuo !== "") {
                    $("#tbody").empty()
                    html = `<tr>
        <td>${Work_datashow[i].Work_id}</td>
        <td>${Work_datashow[i].Work_name}</td>
        <td>${Work_datashow[i].Work_place}</td>
        <td>${Work_datashow[i].Work_content}</td>     
        <td>${Work_datashow[i].Work_tel}</td>
        <td>在职</td>
    <td>
    <button type="button"  class="btn btn-info btn-primary xiugai" data-toggle="modal" data-target="#myModalll">修改</button>
<button type="button" class="btn btn-danger del">删除</button>
    </td>
     </tr>`
                    $("#tbody").append(html);
                }
            }
            if (shousuo == "") {
                init(pageNo, Work_datashow)

            }
        })
        //修改
    $(document).on("click", ".xiugai", function() {

        //获取和按钮同一排的文本内容
        let Work_name
        let Work_place
        let Work_content
        let Work_tel
        let Work_job
        let Work_id = $(this).parent().parent().children().eq(0).html();
        for (let i = 0; i < Work_datashow.length; i++) {
            if (Work_id == Work_datashow[i].Work_id) {

                Work_name = Work_datashow[i].Work_name
                Work_place = Work_datashow[i].Work_place
                Work_content = Work_datashow[i].Work_content
                Work_tel = Work_datashow[i].Work_tel


            }
        }

        //属性选择器
        $("input[name = 'Work_id']").val(Work_id)
        $("input[name = 'Work_name']").val(Work_name)
        $("input[name = 'Work_place']").val(Work_place)
        $("input[name = 'Work_content']").val(Work_content)

        $("input[name = 'Work_tel']").val(Work_tel)


    });

    //点击确定之后获取最新的val值
    $(document).on("click", ".queding", function() {
            let valId = parseInt($(".valzhi").eq(0).val());
            let valName = $(".valzhi").eq(1).val()
            let valPlace = $(".valzhi").eq(2).val()
            let valContent = $(".valzhi").eq(3).val()
            let valTel = $(".valzhi").eq(4).val()
            let valJob = $(".valzhi").eq(5).val()
                //设置一个新的数组

            // let xin = JSON.parse(localStorage.getItem("Work_datashow"));

            for (let i = 0; i < Work_datashow.length; i++) {
                if (Work_datashow[i].Work_id == valId) {
                    Work_datashow[i] = {
                        "Work_id": valId,
                        "Work_name": valName,
                        "Work_place": valPlace,
                        "Work_content": valContent,
                        "Work_tel": valTel,
                        "Work_job": valJob
                    }
                }
            }

            init(pageNo, Work_datashow)
        })
        // $(".queding").click(function() {

    //     })
    //删除功能
    $(document).on("click", ".del", function() {
        let Work_id = $(this).parent().parent().children().eq(0).html();
        for (let i = 0; i < Work_datashow.length; i++) {
            if (Work_id == Work_datashow[i].Work_id) {
                Work_datashow.splice(i, 1)
            }
        }
        init(pageNo, Work_datashow);
    })

    //添加 
    let addTo = {};
    let Work_id
    $(document).on("click", "#tianjia", function() {
        //点击添加会自动获取id
        Work_id = Work_datashow.length + 1;
        //显示id值
        $("input[name = 'new Work_id']").val(Work_id)
            //确定之后获取输入的每个选项的值
        console.log($("input[name = 'new Work_id']").val(Work_id));
    })
    $('body').on("click", ".determine", function() {

        //添加后清空对象
        addTo = {};
        let Id = parseInt($(".addVal").eq(0).val());
        let Name = $(".addVal").eq(1).val()
        let Place = $(".addVal").eq(2).val()
        let Content = $(".addVal").eq(3).val()
        let Tel = $(".addVal").eq(4).val()
        let Job = $(".addVal").eq(5).val()
            //把输入的值放进对象里
        addTo = {
            "Work_id": Id,
            "Work_name": Name,
            "Work_place": Place,
            "Work_content": Content,
            "Work_tel": Tel,
            "Work_job": Job
        };
        //把对象添加进数组里面
        Work_datashow.push(addTo);
        // pageNum = Math.ceil(Work_datashow.length / 5); //页数
        init(pageNo, Work_datashow);
    })
})